<template>
  <HeadTwo :activeIndex="activeIndex"></HeadTwo>
  <bread-crumb>
    <template #one>投入品信息</template>
    <template #two>投入品采购信息</template>
  </bread-crumb>
  <el-card shadow="always" style="margin: 20px;">
    <el-row :gutter="20" class="header">
      <search-bar
          :add-text = searchBarText.addText
          :search-text= searchBarText.searchText
          :placeholder-context= searchBarText.placeholderContext
          @initCgInfo="init"
          @handleDialogCgValue="handleDialogCgValue"
      >
      </search-bar>
      <one-table
          :table-data="tableData"
          :options-info="purchaseInfo"
          @handle-dialog-cg-value="handleDialogCgValue"
          @del-cg-info="deleteCgInfo"
      ></one-table>
      <paging :queryForm="queryForm"
              @my-size-change="handleSizeChange"
              @my-current-change="handleCurrentChange">
      </paging>
    </el-row>
  </el-card>
  <dialog-cg
      v-model="dialogVisible"
      v-if="dialogVisible"
      :dialogCgTableValue="dialogCgTableValue"
      :dialog-cg-title="dialogCgTitle"
      :queryForm="queryForm"
      @handleConfirm="handleConfirm">
  </dialog-cg>
</template>

<script setup>
import {useRouter} from "vue-router";
import HeadTwo from "@/components/header/headTwo.vue";
import {onMounted, provide, ref} from "vue";
import {purchaseInfo} from "@/api/options/twoPart/purchaseInfo.js";
import {isNull} from "@/api/filters.js";
import {ElMessage, ElMessageBox, ElNotification} from "element-plus";
import {addCgInfo, editCgInfo, upCgInfo, delCgInfo} from "@/api/apiPath/twoPart.js";
import Paging from "@/components/pagination/paging.vue";
import SearchBar from "@/components/commons/searchBar.vue";
import BreadCrumb from "@/components/commons/breadCrumb.vue";
import DialogCg from "@/components/dialog/two/dialogCg.vue";
import OneTable from "@/components/table/oneTable.vue";
import {initTableInfo} from "@/api/methods/initInfo.js";
import {addTableInfo} from "@/api/methods/addInfo.js";
import {updateFormInfo} from "@/api/methods/updateInfo.js";
import {delTableInfo} from "@/api/methods/delInfo.js";

const router = useRouter()
const activeIndex = '/trpcgInfo'
const tableData = ref([])
const dialogVisible = ref(false)
const dialogCgTitle = ref('')
const dialogCgTableValue = ref({})
const queryForm = ref({
  query: '',
  pageNum: 1,
  pageSize: 10,
  totalSize: 0
})
const searchBarText = ref({
  addText : "新增投入品",
  searchText : "搜索投入品",
  placeholderContext: "请输入投入品名称"
})
const init = (query)=> {
  queryForm.value.query = query
  initTableInfo(upCgInfo(queryForm.value), tableData, queryForm)
}

onMounted(()=> {
  init()
})

const handleDialogCgValue = (row)=> {
  // console.log(isNull(row))
  if (isNull(row)) {
    dialogCgTitle.value = "新增投入品台账"
    dialogCgTableValue.value = {
      nydjzh: null
    }
  } else {
    dialogCgTitle.value = "编辑投入品台账"
    dialogCgTableValue.value = JSON.parse(JSON.stringify(row))
  }
  dialogVisible.value = true
}
const handleSizeChange = (pageSize)=> {
  queryForm.value.pageSize = pageSize
  queryForm.value.pageNum = 1
  init()
}
const handleCurrentChange = (pageNum)=> {
  queryForm.value.pageNum = pageNum
  init()
}
const handleConfirm = async (formValue, formRef)=> {
  formValue = ref(formValue)
  formRef.validate( async valid => {
    if (!valid) {
      ElMessage({
        message: "请填写完整！",
        type: 'warning',
        duration: 1500
      })
    } else {
      try {
        dialogCgTitle.value === '新增投入品台账'
            ? addTableInfo(addCgInfo(), formValue, upCgInfo(queryForm.value), tableData, queryForm)
            : updateFormInfo(editCgInfo(), formValue, upCgInfo(queryForm.value), tableData, queryForm)
        dialogVisible.value = false
      }catch (err) {
        console.log("errorOne" + err)
        ElNotification({
          message: "请求失败~",
          type: 'error',
          duration: 1500
        })
        dialogVisible.value = false
      }
    }
  })
}
const deleteCgInfo = (row)=> {
  ElMessageBox.confirm(
      '此操作将永久删除该信息，是否继续？',
      '提示',
      {
        confirmButtonText: '确认',
        cancelButtonText: '取消',
        type: 'warning',
      }
  )
      .then(async () => {
        try {
          delTableInfo(delCgInfo(row.bh), tableData, queryForm, upCgInfo(queryForm.value))
          dialogVisible.value = false
        } catch (e) {
          console.log(e)
          ElNotification({
            message: "请求失败",
            type: 'error',
            duration: 1500
          })
          dialogVisible.value = false
        }
      })
      .catch(() => {
        ElMessage({
          type: 'info',
          message: '已取消删除',
        })
        dialogVisible.value = false
      })
}

</script>

<style scoped>

</style>